<template>
  <div class="goodsDesc">
    <myheader title="商品详情">
      <template #left>
        <van-icon name="arrow-left" @click="$router.back()" />
      </template>
    </myheader>
    <h4>{{ goodsDesc.title }}</h4>
    <van-divider
      :style="{
        color: '#1989fa',
        padding: '0 5px',
        borderColor: '#666',
      }"
    ></van-divider>
    <div class="content" v-html="goodsDesc.content"></div>
  </div>
</template>

<script>
import myheader from "@/components/Header.vue";
import { getGoodsDesc } from "@/api/goods.js";
export default {
  data() {
    return {
      goodsDesc: {},
    };
  },
  components: {
    myheader,
  },
  async mounted() {
    let res = await getGoodsDesc(this.$route.params.id);
    console.log(res);
    this.goodsDesc = res.data.message[0];
  },
};
</script>
<style lang="less" scoped>
.goodsDesc {
  h4 {
    color: rgb(23, 103, 207);
    padding: 0 10px;
    font-size: 18px;
  }
  .content {
    width: 100vw;
  }
}
</style>